<template>
	<view class="content">
		<view class="subject mt20">
			<view class="goods flex">
				<view class="goods-img">
					<image src="https://iknow-pic.cdn.bcebos.com/0eb30f2442a7d933ed8c1316af4bd11373f001aa?x-bce-process=image/resize,m_lfit,w_600,h_800,limit_1"
					 mode="scaleToFill" class="goods-img"></image>
				</view>
				<view class="goods-tit fs28 c3 lH42">
					<view class="wordNoSpace">
						贝因美爱加幼儿配方牛奶粉3段800g*6罐
						1-3岁适用
					</view>
					<view class="mt34">
						<u-rate :count="5" v-model="answer" disabled active-color="#FCC019" size="44"></u-rate>
					</view>
				</view>
			</view>
			<view class="info">
				<view class="fs26 c3">宝贝收到了，物流很快，没有异味，宝宝很喜欢，一直拿着不松手！非常满意的一次购物！</view>
				<view class="mt20">
					<image v-for="item in afterInfo.image" :key="item.index" :src="item" mode="aspectFill" class="mr20 infoImage"></image>
				</view>
				<view class="fs20 c9 mt34 infoTime">
					2020.07.12 13:13:13
				</view>
			</view>
			<view class="reflex">
				<view class="fs26 c9 reflexTit">掌柜回复</view>
				<view class="fs26 c9 mt20">亲，感谢您对本店的支持与关注，期待下次与您的相遇，祝您生活愉快，幸福美满！</view>
			</view>
			<view class="flex btngroup mt34 mr10">
				<u-button shape="circle" plain size="mini" :custom-style="lastBtn">添加追评</u-button>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				answer: 5,
				afterInfo: {
					image: ["../../static/header.jpg", "../../static/header.jpg", "../../static/header.jpg"]
				},
				lastBtn: {
					background: "linear-gradient(to right,#F74F6B,#F7284A);",
					color:"#FFFFFF"
				}
			}
		}
	}
</script>

<style scoped>
	.content {
		padding: 0 20rpx;
	}

	.subject {
		padding: 20rpx;
		background: #FFFFFF;
		border-radius: 12rpx;
	}

	.goods {
		padding: 0 16rpx 32rpx 0;
		align-items: flex-start;
		border-bottom: 1rpx solid #F0F0F0;
	}

	.goods-img {
		width: 128rpx;
		height: 128rpx;
		border-radius: 6rpx;
		overflow: hidden;
	}

	.goods-tit {
		width: 504rpx;
	}

	.mt34 {
		margin-top: 34rpx;
	}

	.info {
		padding: 30rpx 0;
	}

	.infoImage {
		width: 200rpx;
		height: 200rpx;
	}

	.infoTime {
		text-align: right;
	}

	.reflex {
		background: #F7F7F7;
		padding: 24rpx;
	}

	.reflexTit {
		font-weight: 700;
	}

	.btngroup {
		justify-content: flex-end;
	}
</style>
